const path = require('path')

// const webpack = require('webpack')
//启动热更新 第2步

const htmlWebpackPlugin = require('html-webpack-plugin')
//导入在内存中生成 HTML 页面的插件
//只要是插件，就一定要放在 plugins 节点中去
const VueLoaderPlugin = require('vue-loader/lib/plugin');

module.exports = {
    entry : path.join(__dirname, './src/main.js'),
    //入口，表示使用webpack打包的文件
    output :{
        path: path.join(__dirname, './dist'),
        //指定打包好的文件储存位置
        filename: 'bundle.js'
        //指定输出文件的名字
    },
//配置"dev": "webpack-dev-server"的第二种方法
    // devServer:{
    //     open:true,  //自动打开浏览器
    //     port:3000,  //设置启动时运行的窗口
    //     contentBase: 'src',  //指定托管的根目录
    //     hot: ture  //启动热更新  第1步
    // },
	devServer: {
        historyApiFallback: true,
        hot: true,
        inline: true,
        contentBase: "./app",
        // port: 3000,
        proxy: {
            "/api": {
              // target: 'http://localhost:8888',
              target: 'https://vm.fowotek.com',
              pathRewrite: {'^/api' : ''},
              changeOrigin: true,  // target是域名的话，需要这个参数，
			  secure: false,  // 设置支持https协议的代理
            }
        },
    },







    plugins: [   //配置插件节点
        // new webpack.HotModuleReplacementPlugin(),
        //创建一个热更新模板对象   第3步

        new htmlWebpackPlugin({
            template: path.join(__dirname,'/src/index.html'),
            //指定模板页面，将来根据这页面路径直接去生成内存中的页面
            filename: 'index.html'
            //指定生成的页面名称
        }),
        new VueLoaderPlugin()
        //路由组件在最新版是需要配置
    ],
    module:{  //这个节点，用来配置 所有 第三方模块 加载器
        rules: [  //所有第三方模块的 匹配规则
            { test:/\.css$/, use: ['style-loader','css-loader']}, // 匹配css类型

            { test:/\.less$/, use: ['style-loader','css-loader','less-loader']}, // 匹配less类型
            { test:/\.scss$/, use: ['style-loader','css-loader','scss-loader']}, // 匹配scss类型
            { test:/\.(jpg|png|gif|bmp|jpeg)$/, use: ['url-loader?limt&name=[hash:8]-[name].[ext']}, // 匹配图片类型，
            //?limt传参，给定的值是图片的大小，单位是byty，如果limit值大于图片大小会转成base64格式字符串，若小于等于则不会转成base64的字符串
            //name传参不改变图片名字和格式
            { test:/\.(ttf|eot|svg|woff|woff2)$/, use: ['url-loader']}, // 匹配处理字体文件

            // { test:/\.js$/, use: 'babel-loader' , exclude: /node_modules/},//配置babel 来转换高级的es6语法
            { test:/\.vue$/, use: 'vue-loader'},  //处理 .vue 文件的loader
			{ test: /\.scss$/, loaders: ['style', 'css', 'sass']}
        ]
    },
    resolve: {
        alias: {  //修改 vue 被导入时候的包路径
            "vue$": 'vue/dist/vue.js' //以vue结尾的往地址中寻找
        }
    }
}